<template>
  <div class="home">
    <router-view v-slot="{ Component, route }">
      <transition name="router-fade" mode="out-in">
        <component :is="Component" :key="route.matched?.[1]?.path" />
      </transition>
    </router-view>
  </div>
</template>

<script setup>
import { watch,onMounted } from "vue";
import useUserStore from "@/store/modules/user";
import { setLocalCache } from "@/utils/cache";
import defaultConfig from "@/settings";
import useReceiveMainData from "@/hooks/microApp/useReceiveMainData";
import useCodeArrStore from '@/store/modules/select'
import { getOptionselect } from "@/apis/login";
const userStore = useUserStore();
const { receiveData } = useReceiveMainData();
const getCodeArr = ()=>{
  getOptionselect().then(res=>{
    useCodeArrStore().setDict(res.data)
  })
}
onMounted(() => {
  getCodeArr();
})
watch(
  () => receiveData.value,
  newVal => {
    userStore.userInfo = newVal?.userInfo;
    setLocalCache(defaultConfig.tokenAttr, newVal?.token);
  }
);
</script>
<style scoped lang="scss">
@import "@/assets/styles/transition.css";
.home {
  height: 100%;
}
</style>
